<template>
  <div class="">
    <el-dialog v-model="dialogFormVisible" title="新建乐谱" width="500">
      <el-form :model="props.form">
        <el-form-item label="">
          <el-input
            v-model="input"
            style="width: 100%"
            placeholder="请输入标题"
          />
        </el-form-item>
        <el-form-item label="">
          <el-select v-model="props.form.region" placeholder="请选择">
            <el-option label="1/4" value="1/4" />
            <el-option label="2/4" value="2/4" />
            <el-option label="3/4" value="3/4" />
            <el-option label="4/4" value="4/4" />
            <el-option label="3/8" value="3/8" />
          </el-select>
        </el-form-item>
        <el-form-item label="">
          <el-select v-model="props.form.speed" placeholder="请选择">
            <el-option label="0.5" value="0.5" />
            <el-option label="1" value="1" />
            <el-option label="1.25" value="1.25" />
            <el-option label="1.5" value="1.5" />
            <el-option label="2" value="2" />
          </el-select>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取消</el-button>
          <el-button type="primary" @click="onAddList"> 确定 </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import MyHomeApi from "../../api/index";
const props = defineProps(["form", "data", "Share"]);
const emit = defineEmits(["onAddList"]);
const dialogFormVisible = defineModel("firstName");
const input = ref("");
const onAddList = () => {
  let editList = {
    id: new Date().getTime(),
    userId: props.data.id,
    title: input.value,
    author: props.data.name,
    position: props.data.class,
    catalogue: "编辑区",
    // sharer:'',
    // like:0,
    lastEditTime:
      new Date().getFullYear() +
      "-" +
      new Date().getMonth() +
      "-" +
      new Date().getDay(),
    tempo: props.form.region,
    speed: props.form.speed,
    notes: [
      { pitch: "C4", duration: 0.5 },
      { pitch: "D4", duration: 0.5 },
      { pitch: "E4", duration: 0.5 },
      { pitch: "E4", duration: 0.5 },
    ],
  };
  MyHomeApi.addWorks(editList).then((res) => {
    props.Share.value = res.data.data;
    MyHomeApi.getEditList(3, props.data.id).then((msg) => {
      props.Share.value = msg.data.data;
    });
  });
  emit("onAddList", editList);
  dialogFormVisible.value = false;
  input.value=''
};
</script>
<style scoped lang="scss"></style>
